<ol class="breadcrumb">
    <li><a href="#">点单服务</a></li>
    <li>订单管理</li>
</ol>

<div class="panel panel-default">
    <div class="panel-heading">
        <span class="glyphicon glyphicon-list"></span>
        <span class="panel-title">订单列表</span>
    </div>
    <div class="table-responsive">
        <table class="table table-striped table-hover">
            <thead>
            <tr>
                <th>商品信息</th>
                <th>订单编号</th>
                <th>客户昵称</th>
                <th>取餐密码</th>
                <th>订单时间</th>
                <th>订单价格</th>
                <th>操作</th>
            </tr>
            </thead>
            <tfoot>
            <tr>
                <td colspan="8">
                    <nav class="twbsPagination"></nav>
                </td>
            </tr>
            </tfoot>
            <tbody>
            <% orders.forEach(function(order, index){ %>
            <tr>
                <td>
                    <% order.goodses.forEach(function(goods, index){ %>
                    <div class="goods">
                        <img class="pic"
                             src="<%= goods.pic_url %>?imageView2/2/w/50/interlace/0/q/50"/>
                        <span class="name"><%= goods.goods_name %></span>
                        <span class="count">x&nbsp;<%= goods.count %></span>
                        <span class="note"><%= goods.note %></span>
                    </div>
                    <% }); %>
                </td>
                <td><%= order.trade_no %></td>
                <td><%= order.user_nickname %></td>
                <td><%= order.pass_code %></td>
                <td><%= order.create_date_format %></td>
                <td>￥<%= order.total_fee_format %></td>
                <td>
                    <% if(session.permissionMap[4006]){ %>
                    <a href="/cafe/order/remove/<%= order.trade_no%>" onclick="return confirm('你确定要删除这个订单吗？')" class="btn btn-danger btn-sm">删除</a>
                    <% } %>
                </td>
            </tr>
            <% }); %>
            </tbody>
        </table>
    </div>
</div>

<script type="text/javascript">
    $(function () {
        //分页功能
        $('.twbsPagination').twbsPagination({
            totalPages: <%=pageCount%>,
            visiblePages: 10,
            href: '/cafe/order/list?num={{number}}'
        });
    });
</script>
<style rel="stylesheet">
    .goods {
        border: 1px solid #eeeeee;
        border-bottom: none;
        width: 300px;
        position: relative;
        height: 50px;
    }

    .goods * {
        height: 25px;
        line-height: 25px;
        float: left;
    }

    .goods:last-child {
        border: 1px solid #eeeeee;
    }

    .goods .pic {
        border: 1px solid #c0c0c0;
        border-radius: 5%;
        margin: 3px;
        height: 43px;
        width: 50px;
    }

    .goods .name {
        margin-left: 5px;
        font-weight: bold;
        width: 200px;
    }

    .goods .note {
        margin-left: 5px;
        color: #949494;
    }

    .goods .count {

    }

</style>